<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <link href="http://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <script src="http://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <script src="http://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="http://cdn.bootcss.com/angular.js/1.3.20/angular.min.js"></script>
    <title>问卷调查</title>
</head>
<body>
<div class="wrap" style="padding: 10px 15px;" ng-controller="fmController">
    <form role="form" action="http://ihshow.cn:8080/vote/submit">
        <div class="form-group">
            <label>输入框</label>
            <input type="text" class="form-control" ng-model="fm.q1" placeholder="请输入您的名称">
        </div>
        <div class="form-group">
            <label>多选框</label>
            <div class="checkbox" ng-model="fm.q2">
                <label>
                    <input type="checkbox" value="选项1" ng-click="fs($event)">选项1
                </label>
                <label>
                    <input type="checkbox" value="选项2" ng-click="fs($event)">选项2
                </label>
                <label>
                    <input type="checkbox" value="选项3" ng-click="fs($event)">选项3
                </label>
            </div>
        </div>
        <div class="form-group">
            <label>下拉框</label>
            <select class="form-control" ng-model="fm.q3">
                <option value="">请选择...</option>
                <option value="下拉列表1">下拉列表1</option>
                <option value="下拉列表2">下拉列表2</option>
                <option value="下拉列表3">下拉列表3</option>
                <option value="下拉列表4">下拉列表4</option>
            </select>
        </div>
        <div class="form-group">
            <label>微信号<span style="color: red;">*</span></label>
            <input type="text" class="form-control" ng-model="fm.weixin" placeholder="请输入您的微信号">
        </div>
        <div class="form-group">
            <label>描述信息</label>
            <textarea class="form-control" rows="3" ng-model="fm.remark"></textarea>
        </div>
        <button type="button" ng-disabled="submitDisabled" ng-click="submit()" style="width: 100%;" class="btn btn-primary">提交</button>
    </form>
</div>
<script>
    var app = angular.module("app",[]);
    app.controller("fmController",["$scope", "$http", function($scope, $http){
        $scope.fm = {};
        $scope.submitDisabled = false;
        $scope.submit=function(){
            if($scope.weixin){

            }
            $scope.submitDisabled = true;
            for(var q in $scope.fm){
                if($.isArray($scope.fm[q])){
                    $scope.fm[q] = $scope.fm[q].join(",");
                }
            }
            $http({
                url: "http://ihshow.cn/vote/submit",
                method: "POST",
                headers: {'Content-Type': 'application/x-www-form-urlencoded'},
                data: $.param($scope.fm)
            }).success(function(){
                alert("提交成功，感谢您的支持，谢谢");
            }).error(function(){
                $scope.submitDisabled = false;
            })
        };
        $scope.fs=function($event){
            var tar = $event.target;
            var ck = $(tar).is(":checked");
            var md = $(tar).closest(".checkbox[ng-model]").attr("ng-model");
            var mv = $scope.gmd(md);
            if(mv){
                $scope.smv(mv,tar.value,ck);
            }
        };
        $scope.smv=function(m,v,k){
            if($.isArray(m)){
                var f=true;
                for(var i=0;i<m.length;i++){
                    if(m[i]==v){
                        if(!k){
                            m.splice(i,1);
                            break;
                        }
                        f=false;
                        break;
                    }
                }
                if(f&&k){
                    m.push(v);
                }
            }
        };
        $scope.gmd=function(md){
            if(md){
                md=md.split(".");
                var a=md[0];
                var b=md[1];
                var fm=$scope[a];
                if(!fm[b]){
                    fm[b] = [];
                }
                return fm[b];
            }
        };
    }]);
    angular.bootstrap(document, [ "app" ]);
</script>
</body>
</html>